import React, {PureComponent, Component} from "react";
import {
    View,
    Button,
    Text,
    StyleSheet,
    TextInput,
    Switch,
    ScrollView,
    Dimensions,
    TouchableOpacity,
    ToastAndroid,
    Linking,
    Platform,
    SafeAreaView,
    DeviceEventEmitter,
    Image,
    FlatList,
} from "react-native";
// import RefreshListView, {
//     RefreshState
// } from "react-native-refresh-list-view";
// import EmptyCouponView from "../../../widget/CommonEmptyView";
// import api from '../../../api/api'
// import method from '../../../api/method'
// import NetTool from '../../../api/NetTool'
// // import Tips from "react-native-root-tips";
// // import DeviceStorage from "../../utils/DeviceStorage";
// // import define from "../../utils/define";
// import  MineShopCell from '../../../widget/shopping/MineShopCell'
// import { observer } from 'mobx-react/native';
// import { action, autorun } from 'mobx';
const {width, height} = Dimensions.get('window')
// import ShopMobxStore from './ShopMobxStore';
// import UseCouponDialog from '../../../widget/dialog/UseCouponDialog'
// import {fetchGetRequest} from "../../../api/NetworkTool";
// type State = {
//     data: Array < Object >,
//     refreshState: number,
// }
// type Props = {
//     navigation: any,
// }
// @observer
export default class ShoppingScene extends Component<Props>{
    static navigationOptions = ({navigation}: any) => ({
        headerTintColor: 'black',
        title: '购物车',
        headerStyle: {backgroundColor: 'white'},
        headerRight: <Text/>,
        headerLeft:<TouchableOpacity onPress={()=>{
            navigation.goBack()
        }}>
            <Image style={{marginLeft:12}} source={require('../../../../res/img/gobal_back.png')}/>
        </TouchableOpacity>
    })
    // constructor(props) {
    //     super(props)
    //     this.state = {
    //         refreshState: RefreshState.Idle,
    //         isEdit:false,
    //         courses:[],
    //         payShow:false,
    //         couponData:[],
    //         isShow:false,
    //     }
    //     this.data = new ShopMobxStore();
    // }
    //
    // componentDidMount() {
    //     this.requestFirstPage()
    //
    //
    // }
    // @action
    // allSelect = () => {
    //     DeviceEventEmitter.emit('allSelect', !this.data.itemData.isAllSelect);
    //     this.data.selectAll();
    // };
    //
    // requestData = async() => {
    //     let json = await NetTool.fetchGetRequest(api.shop_list, method.get,)
    //      json.course = json.course.map((info) => {
    //         return {
    //             id: info.id,
    //             title: info.title,
    //             start_date: info.start_date,
    //             end_date: info.end_date,
    //             teacher: info.teacher,
    //             tag: info.tag,
    //             subject: info.subject,
    //             end_time:info.end_time,
    //             frequency:info.frequency,
    //             price:info.price,
    //             start_time:info.start_time,
    //             isSelect:false,
    //     }
    //     })
    //     this.setState({courses:json.course})
    //     return json
    //
    // }
    //
    // requestFirstPage = async() => {
    //
    //     try {
    //         this.setState({
    //             refreshState: RefreshState.HeaderRefreshing
    //         })
    //         let json = await this.requestData()
    //         json.isAllSelect = false
    //         json.totalMoney = 0
    //         this.data.replace(json)
    //
    //         this.setState({
    //             refreshState: RefreshState.Idle,
    //         })
    //     } catch (error) {
    //         this.setState({
    //             refreshState: RefreshState.Failure,
    //         })
    //     }
    // }
    // requestNextPage = async() => {
    //
    // }
    // //custon ui
    // keyExtractor = (item: Object, index: number) => {
    //     return index + ''
    // }
    // renderCell = (rowData: any) => {
    //     return (
    //         <MineShopCell itemData={rowData.item} data={this.data}  isShow={(item)=>{
    //             this.getCouponData(rowData.item)
    //
    //
    //         }}/>
    //     )
    // }
    // getCouponData(course){
    //     this.setState({isShow:true})
    //
    //     let params = {
    //         course:course.id,
    //     }
    //     fetchGetRequest(api.coupon_find,method.get,params)
    //         .then(res=>{
    //             let dataList = this.mapdata(res)
    //             this.setState({couponData:dataList})
    //             // if (dataList.length <= 0){
    //             //     this.setState({coupon_title:'请选择优惠券',distinct:''})
    //             // }
    //         })
    //         .catch(err=>{})
    // }
    // renderHeader(){
    //     return <View>
    //             <View style={{width:width, height:46, alignItems:'center', flexDirection:'row',backgroundColor:'white'}}>
    //                 <Image style={{width:22,height:18,marginLeft:12}} source={require('../../../../res/img/ic_avatar_default.png')}/>
    //                 <Text style={{color:'#333333',fontSize:12,marginLeft:18,width:(width - 124)}}>北京市海淀区双... </Text>
    //                 <View style={{width:10,height:1}}/>
    //                 <TouchableOpacity style={{marginRight:12,height:44,justifyContent:'center',alignItems:'center',}}
    //                                   onPress={()=>{
    //                                       this.setState({isEdit:!this.state.isEdit})
    //                                   }}>
    //                     <Text style={{color:'#DB3843', fontSize:12}}>编辑选课</Text>
    //                 </TouchableOpacity>
    //             </View>
    //         <View style={{width:width,height:1,backgroundColor:'rgba(0,0,0,0.1)'}}/>
    //     </View>
    //
    // }
    // renderBootom(){
    //
    //     if (this.state.isEdit) {
    //         return <View style={{width:width,height:62,backgroundColor:'white',flexDirection:'row',alignItems:'center'}}>
    //             <TouchableOpacity style={{marginLeft:30,width:50,height:40,flexDirection:'row', alignItems:'center'}}>
    //                 <Image style={{width:10,height:10}} source={require('../../../../res/img/detail/detail_select.png')}/>
    //                 <Text style={{marginLeft:7,color:'#333333',fontSize:12}}>全选</Text>
    //             </TouchableOpacity>
    //             <View style={{flex:1}}/>
    //
    //             <TouchableOpacity style={{marginLeft:12,backgroundColor:'#DB3843', width:92,height:34,borderRadius:17,marginRight:10,justifyContent:'center',alignItems:'center'}}>
    //                 <Text style={{color:'white',fontSize:14,fontWeight:'bold'}}>删除</Text>
    //             </TouchableOpacity>
    //         </View>
    //     }else {
    //     return <View style={{width:width,height:62,backgroundColor:'white',flexDirection:'row',alignItems:'center'}}>
    //         <TouchableOpacity onPress={this.allSelect} style={{marginLeft:30,width:50,height:40,flexDirection:'row', alignItems:'center'}}>
    //             <Image style={{width:10,height:10}} source={this.data.itemData.isAllSelect  ? require('../../../../res/img/detail/detail_select.png') : require('../../../../res/img/detail/detail_un_select.png')}/>
    //             <Text style={{marginLeft:7,color:'#333333',fontSize:12}}>全选</Text>
    //         </TouchableOpacity>
    //         <View style={{flex:1}}/>
    //         <View style={{justifyContent:'center'}}>
    //             <View style={{flexDirection:'row',alignItems:'center'}}>
    //                 <Text style={{color:'rgba(0,0,0,0.6)',fontSize:12,fontWeight:'bold'}}>总计价格</Text>
    //                 <Text style={{marginLeft:12,color:'#DB3843',fontSize:16,fontWeight:'700'}}>¥ {this.data.itemData.totalMoney}</Text>
    //             </View>
    //             <View style={{flexDirection:'row',alignItems:'center',marginTop:5}}>
    //                 <Text style={{color:'#010101',fontSize:12,fontWeight:'bold'}}>优惠价格</Text>
    //                 <Text style={{color:'#DB3843',fontSize:16,fontWeight:'700',marginLeft:12}}>¥ 55</Text>
    //
    //             </View>
    //         </View>
    //         <TouchableOpacity style={{marginLeft:12,backgroundColor:'#DB3843', width:92,height:34,borderRadius:17,marginRight:10,justifyContent:'center',alignItems:'center'}}>
    //             <Text style={{color:'white',fontSize:14,fontWeight:'bold'}}>立即结算</Text>
    //         </TouchableOpacity>
    //     </View>
    //     }
    // }

    render(){
        // let courses = this.data.itemData.course
        // return <SafeAreaView style={styles.container}>
        //     <RefreshListView
        //         ListHeaderComponent={() => (
        //
        //             !this.state.courses.length?
        //                 <EmptyCouponView height={(height-200)} tip={'没有找到相关课程信息'} source={require('../../../../res/img/select/kecheng.png')}/>
        //                 : this.renderHeader())
        //         }
        //         data={courses}
        //         renderItem={this.renderCell}
        //         keyExtractor={this.keyExtractor}
        //         refreshState={this.state.refreshState}
        //         onHeaderRefresh={this.requestFirstPage}
        //         onFooterRefresh={this.requestNextPage}
        //         ItemSeparatorComponent={()=><View style={{width:width - 24,height:1,backgroundColor:'rgba(0,0,0,0.1)',marginLeft:12}}/>}
        //     />
        //     <UseCouponDialog data={this.state.couponData} show={this.state.isShow} closeModal={(show)=>{
        //         this.setState({isShow:show})
        //     }} callBack={(info)=>{
        //         // let distinct = '此券可用，去结算立减'+info.price+'元'
        //         // this.setState({coupon_title:info.title,distinct:distinct})
        //         // this.props.callBack(info)
        //     }} cancelPress={()=>{
        //         // this.setState({coupon_title:'请选择优惠券',distinct:''})
        //     }}/>
        //     {this.renderBootom()}
        // </SafeAreaView>
    }
    mapdata(res){
        let dataList = res.coupon.map((info) => {
            return {
                id: info.id,
                title: info.title,
                count: info.count,
                price: info.price,
                status: info.status,
                start_datetime: info.start_datetime,
                end_datetime: info.end_datetime,
                coupon_sn: info.coupon_sn,
            }
        })


        return dataList
    }

}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#F5F5F5',
        width: width,
    },
});